<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<div>
    <input type="text" placeholder="请输入内容" id="textU">
    <input type="button" value="添加" onclick="addItem()">
</div>
<div>
    <ul id="city">

    </ul>
</div>


<script type="text/javascript">
    function addItem() {
        // 1 找到输入标签
        var textTag = document.getElementById("textU");

        // 2 获取input输入内容
        var tagText = textTag.value;

        // 判断输入内容是否为空
        if (tagText.length > 0) {
            // 3 创建标签
            var newTag = document.createElement("li")
            newTag.innerText = tagText;
            // 4 添加标签
            var parTag = document.getElementById("city");
            parTag.appendChild(newTag);
            // 5 将输入框清空
            textTag.value = "";
        }else {
            alert("输入不能为空")
        }


    }


</script>


</body>
</html>